import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:todo_app/components/TextExt.dart';
import 'package:todo_app/components/UserNameAvatar.dart';
import 'package:todo_app/controllers/GroupController.dart';
import 'package:todo_app/controllers/definitions/GroupModel.dart';
import 'package:todo_app/controllers/definitions/UserModel.dart';
import 'package:todo_app/layout/CustomCard.dart';
import 'package:todo_app/layout/Gaps.dart';
import 'package:todo_app/layout/Header.dart';
import 'package:todo_app/layout/ListItem.dart';
import 'package:todo_app/utils/AppNavigator.dart';


class GroupUserPage extends HookWidget {
  const GroupUserPage( {Key? key, required this.id}) : super(key: key);
  final String id;

  @override
  Widget build(BuildContext context) {
    var userList = useState<List<UserModel>>([]);
    var detail = useState<GroupModel?>(null);

    useEffect(() {
      GroupController.usersUsingGet(id).then((res) => {
        if(res.status == 'success') {
          userList.value = res.data ?? []
        }
      });
      GroupController.detailUsingGet(id).then((res) => {
        if(res.status == 'success') {
          detail.value = res.data
        }
      });
      return () { };
    }, []);

    return Scaffold(
      appBar: const Header(
        title: "分组成员"
      ),
      body: SingleChildScrollView(
        child: CustomCard(
          margin: EdgeInsets.only(top: 15.dp),
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: userList.value.map<Widget>((user) {
              return ListItem(
                height: 56.dp,
                onTap: () {
                  AppNavigator.pushNamed('personDetail', params: {
                    "id": user.id.toString()
                  });
                },
                icon: UserNameAvatar(username: user.nickname ?? user.realname ?? "", size: 44.dp,),
                title: TextExt.title(user.nickname ?? user.realname ?? "", fontSize: 18.dp),
                border: userList.value.last != user,
                nextIcon: true,
              );
            }).toList(),
          ),
        ),
      ),
    );
  }
}